;(function($) {
	$.fn.MY_ScrollBox = function(vars) {
		/*
		 主容器、子容器、子单元、
		 * */
		var config = {
			childBox: 'ul',
			childBtnBox: 'ol',
			unit: 'li',
			speed: 1000,
			ainimateTime: 500,
			direction: 'x'
		};
		config = $.extend(config, vars);
		/*
		 图片宽度、图片数、图片总宽度、滚动间隔时、动画时
		 * */
		var parentBox = $(this),
			childBox = parentBox.find(config.childBox),
			childBtnBox = parentBox.find(config.childBtnBox),
			btnArr = childBtnBox.find("li"),
			imgWidth = parentBox.find('img').width(),
			imgHeight = parentBox.find('img').height(),
			imgNum = parentBox.find('img').length,
			imgAllWidth = imgWidth * imgNum,
			imgAllHeight = imgHeight * imgNum,
			imgActiveID = 0,
			imgNextID = 0,
			setIntervalID;

		/*图片轮换方法*/
		var rotate = function(clickID) {

			if (clickID) {
				imgNextID = clickID;
			} else {
				imgNextID = imgActiveID <= imgNum - 1 ? imgActiveID + 1 : 1;
			}

			// 切换 active 的小圆点
			// 把当前 active 的小圆点置为默认样式
			// 把下一个需要显示为红色的小圆点添加 active 这个 class
			$(btnArr[imgActiveID - 1]).removeClass('z-active');
			$(btnArr[imgNextID - 1]).addClass('z-active');

			// 切换图片
			switch (config.direction) {
				case 'x':
					// 设置 图片容器 的宽度
					childBox.css({
						'width': imgAllWidth + 'px'
					});
					childBox.stop().animate({
						'margin-left': '-' + ((imgNextID - 1) * imgWidth) + 'px'
					}, config.ainimateTime);
					break;
				case 'y':
					childBox.css({
						'height': imgAllHeight + 'px'
					});
					childBox.stop().animate({
						'margin-top': '-' + ((imgNextID - 1) * imgHeight) + 'px'
					}, config.ainimateTime);
					break;
			}
			imgActiveID = imgNextID;
		}

		// 启动图片自动轮播
		setIntervalID = setInterval(rotate, config.speed);

		// 鼠标移动到图片上时停止图片切换
		// 鼠标移开后继续切换
		childBox.hover(function() {
			// 停止自动切换
			clearInterval(setIntervalID);
		}, function() {
			// 启动自动切换
			setIntervalID = setInterval(rotate, config.speed);
		});

		// 点击右下方小圆点切换图片
		btnArr.hover(function() {
			// 停止自动切换
			clearInterval(setIntervalID);
			var clickID = parseInt($(this).index() + 1);
			rotate(clickID);
		}, function() {
			// 启动自动切换
			setIntervalID = setInterval(rotate, config.speed);
		});

		return parentBox;
	}
})(jQuery);